﻿@charset "utf-8";
/* CSS Document */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video{ word-wrap:break-word; word-break:break-all; padding:0; margin:0; list-style:none; outline:0; -webkit-tap-highlight-color:rgba(0,0,0,0); font:inherit; font-size:14px; vertical-align:baseline; font-family:'Microsoft YaHei',Helvetica,Arial,sans-serif; -webkit-overflow-scrolling: touch; overflow-scrolling: touch;}
body{overflow-x:hidden; font-size:1em;}
button,input,option,select,textarea,em{ -webkit-appearance:none; -webkit-text-size-adjust:none; outline:none; -webkit-tap-highlight-color:rgba(0,0,0,0); border-radius:0;}
input[type="button"], input[type="submit"], input[type="reset"] {-webkit-appearance: none; border-radius:0;}
button,img,input,nav,textarea,video{border:0;}
/*body,td{font-size:.9em}*/
a,a:visited{text-decoration:none;-webkit-touch-callout:none; -webkit-tap-highlight-color:rgba(0,0,0,0);}
body,html{height:100%}
.clear{ clear:both; padding:0; margin:0; line-height:0;}
.clearfix{zoom:1;}
.clearfix:after,.clearfix:before{content:"";display:block;height:0;width:0;visibility:hidden}
.clearfix:after{clear:both;}
.bg1{ background: #f3e9ff;}

.header{height:80px; border-bottom: 1px solid #eaeaea;}
.headerM{ width: 1200px; margin: 0 auto;}
.headerM .logo{ float: left; font-size: 35px; font-weight: bold; line-height: 80px;}
.headerM .nav{ float: right; text-align:right; font-size: 0;}
.headerM .nav div{ display: inline-block; position: relative; height: 80px; line-height: 80px; margin: 0 10px;}
.headerM .nav div>a{ display:inline-block; color: #666; height: 40px; line-height: 40px; font-size: 16px; padding: 0 40px; border-radius: 50px;}
.headerM .nav div>a.on{background: #f3f3f3;}
.headerM .nav div>a:hover{background: #f3f3f3;}
.headerM .nav div ul{ position: absolute; top: 80px; background: #FFF; box-shadow: 0 1px 2px #c5c5c5; display: none; width: 100%; border-radius: 10px; padding: 20px 0;}
.headerM .nav div ul li{ height: 40px; line-height: 40px; text-align: center;}
.headerM .nav div ul li a{ font-size: 15px; color: #666666;}
.headerM .nav div ul li a:hover{ color: #9667ad; border-bottom: 1px solid #9667AD;}
.headerM .nav div:hover ul{ display: block;}

.banner{ height: 650px; background:url(/Content/images/web/bg.png) no-repeat scroll center center; background-size:100%; overflow-x: hidden;}
.bannerM{ width: 1200px; margin: 0 auto;}
.bannerM .leftImg{float: left; margin:80px 0 0;}
.bannerM .leftImg img{ width: 600px;}
.rightMessage{padding: 0 0 0 40px; float: right; width: 500px; margin:175px 0 0;}
.rightMessage h2{color: #FFF; font-size:36px; padding: 0 0 10px;}
.rightMessage h3{color: #FFF; font-size:30px; padding: 0 0 60px;}
.rightMessage p{color: #FFF; font-size:16px;}

.pointS{ margin: -40px 0 0;}
.pointSM{ width: 1200px; margin: 0 auto; height:150px; background:#FFF; border-radius:10px; box-shadow:0 2px 8px #e0cfef; display: flex;}
.pointSM .pointSMBox{flex: 1;}
.pointSM .pointSMBox dl{ margin: 20px;}
.pointSM .pointSMBox dl dt{ float: left; width: 100px; height: 100px; text-align: center; line-height: 100px;}
.pointSM .pointSMBox dl dt i{ font-size: 65px; color: #5f1d94; font-weight: bold;}
.pointSM .pointSMBox dl dd{ overflow: hidden;}
.pointSM .pointSMBox dl dd h3{ font-size: 18px; padding: 10px 0;}
.pointSM .pointSMBox dl dd p{ color: #666;}

.content { width: 1200px; margin: 0 auto;}
.content .characteristic{ padding: 40px 0;}
.content .characteristic h3{ text-align: center; font-size: 30px; padding: 20px 0 40px; position: relative;}
.content .characteristic h3::before{content:""; display: block; width: 100px; height: 2px; position: absolute; left: 0; top: 70px; right: 0; bottom: auto; margin: auto; background: #5f1d94;}
.content .characteristic h3::after{content:""; display: block; width: 50px; height: 2px; position: absolute; left: 0; top: 77px; right: 0; bottom: auto; margin: auto;  background: #5f1d94;}
.content .characteristic h4{ text-align: center; font-size: 16px; color: #666; padding: 0 0 40px;}
.content .characteristic .characteristicBox{ text-align: center;}
.content .characteristic .characteristicBox .characteristicBoxN{display: inline-block; width: 29%; text-align: justify; border-radius: 5px; box-shadow:0 2px 8px #e0cfef; margin:20px; box-sizing: border-box; padding: 40px;}
.content .characteristic .characteristicBox .characteristicBoxN .imgBox{ width: 100px; height: 100px; border:3px solid #FFF;}
.content .characteristic .characteristicBox .characteristicBoxN .imgBox img{ width: 100%; height: 100%;}
.content .characteristic .characteristicBox .characteristicBoxN dl dt{ font-size: 20px; padding: 10px 0; font-weight: bold;}
.content .characteristic .characteristicBox .characteristicBoxN dl dd{ color: #666; line-height: 1.8em;}

.productBox{ display: flex;}
.productBox .productBoxN{ flex: 1; text-align: center;}
.productBox .productBoxN .productBoxNN{margin: 10px; box-shadow:0 2px 8px #e0cfef; padding: 40px 0; background:linear-gradient(#8350ad, #6205ab); color: #FFF;}
.productBox .productBoxN .imgBox{ width: 100px; height: 100px; line-height: 100px; margin: 0 auto 20px;}
.productBox .productBoxN .imgBox i{ font-size: 80px;}
.productBox .productBoxN dl dt{ font-size: 20px; padding: 0 0 10px;}

.payList li{ float: left; width: 200px; height: 200px; line-height: 200px; text-align: center; border-radius:50%; border: 1px solid #dedede; margin:20px 49px;}
.payList li img{ vertical-align: middle;}

.bts{ text-align: center;}
.bts .bt1{ height: 60px; line-height: 60px; border-radius: 10px; font-size: 26px; padding: 0 40px; color: #FFF; background:linear-gradient(#d1b1f5, #ab6ddc); display: inline-block;cursor:pointer}


.leftF{ float: left;}
.rightF{ float: right;}

.programme{ padding: 80px 0;}
.programmeM{ width: 1200px; margin: 0 auto;}
.programmeM .messageBox{ width: 50%; box-sizing: border-box;}
.programmeM .messageBox h3{ position: relative; height: 80px; line-height: 80px;}
.programmeM .messageBox h3::before{ content:""; display: block; position: absolute; width: 100px; height: 2px; background: #5f1d94; bottom: 15px;}
.programmeM .messageBox h3::after{ content:""; display: block; position: absolute; width: 60px; height: 2px; background: #5f1d94; bottom: 10px;}
.programmeM .messageBox h3 span{ font-size: 24px;}
.programmeM .messageBox ul{ padding: 30px 0;}
.programmeM .messageBox ul li{ min-height: 40px; margin: 0 0 20px;}
.programmeM .messageBox ul li em{ float: left; width: 24px; height: 24px; text-align: center; line-height: 24px; border-radius: 50%; background: #ab6ddc; color: #FFF; margin: 0 20px 0 0;}
.programmeM .messageBox ul li .rightCon{ overflow: hidden;}
.programmeM .messageBox ul li .rightCon p{ font-size: 16px; line-height: 1.8em; color: #666;}
.programmeM .imgBox{ overflow: hidden;}


.footer{ background:#472661; min-height: 100px; }
.footerM{ width: 1200px; margin: 0 auto; padding: 80px 0 40px;}
.footerM .leftMenu{float: left; color: #FFF; width: 50%;}
.footerM .leftMenu .leftBox{ float: left; padding: 0 20px 0 0; min-width:150px;}
.footerM .leftMenu .leftBox h4{ padding: 0 0 10px;}
.footerM .leftMenu .leftBox h4 span{ font-size: 16px;}
.footerM .leftMenu .leftBox ul li{ height: 40px; line-height: 40px;}
.footerM .rightMes{ color: #FFF;}
.footerM .rightMes h3{ font-size: 16px; padding: 0 0 20px;}
.footerM .rightMes ul li{ height:30px; line-height: 30px;}
.bottomMes{ text-align: center; color: #FFF; background: rgba(0,0,0,.3); padding: 20px 0;}


.loginBox{ background: url(/Content/images/web/bg.jpg) no-repeat scroll center center;height: 700px; position: relative;}
.loginBox::after{content:""; position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; background: rgba(94,30,144,.6); z-index: 1;}
.login{ width: 600px; height: 500px; border-radius:10px; background: #FFF; position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; z-index: 2; box-sizing: border-box; padding: 40px; box-shadow:0 2px 8px #e0cfef;}
.login h3{ font-size: 28px;}
.login ul{ padding: 20px 0;}
.login ul li{ min-height: 40px; padding: 10px 20px;}
.login ul li input{ border-bottom: 1px solid #dedede; height: 60px; line-height: 60px; width: 100%; font-size: 16px;}
.login .bts{ padding: 20px 0;}
.login .bts a{height: 50px; line-height: 50px; border-radius: 5px; font-size: 18px; padding: 0 40px; color: #FFF; background:#864cb5; display: inline-block; width: 150px; cursor: pointer;}
.login .bts a:hover{ background:linear-gradient(#d1b1f5, #ab6ddc);}

.sbanner{ position: relative;overflow: hidden; height: 300px;}
.sbanner img{ max-width: 100%; position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto;}
.sbanner::after{ content: ""; display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; background: rgba(106 62 165 / 88%); z-index: 1;}
.sbanner h2{ font-size: 26px; position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; width: 25%; height:100px; line-height: 100px; color: #FFF; border: 1px solid #FFF; z-index: 2; text-align: center; letter-spacing: 0.2em;}

.contactBox{}
.contactBoxM{ width: 1200px; margin: 0 auto; padding: 60px 0;}
.contactBoxM ul{ float: left; width: 50%; font-size: 16px; padding: 40px 0 0;}
.contactBoxM ul li{ min-height: 40px; font-size: 16px;}
.contactBoxM ul li em{ float: left; font-size: 16px;}
.contactBoxM ul li .rightCon{overflow: hidden; font-size: 16px;}
.contactBoxM ul li .rightCon p{ font-size: 16px;}
.contactBoxM .imgBox{ overflow: hidden; text-align: center;}

.friends{ background: url(/Content/images/web/hezuobg.jpg) no-repeat scroll center bottom; height: 600px;position: relative;}
.friends::after{content: ""; display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; background: rgba(106 62 165 / 88%); z-index: 1;}
.friendsM{ width: 1200px; margin: 0 auto; z-index: 2; position: relative; height: 100%;}
.friendsM .list{ position: absolute; left: 0; top: 10%;right: 0; bottom: 10%; margin: auto; background: #FFF; box-sizing: border-box; padding: 20px; border-radius: 10px;}
.friendsM .list div{ float: left; width: 160px; padding:20px 65px;}

#code{width: 80px; height: 30px; display: inline-block; font-size: 18px; line-height: 30px; text-align: center; color: #333; border: 1px solid red; cursor: pointer;}

.fixBox{ position:fixed; right:0; bottom:100px;}
.fixBox .fixBoxN{ width:60px; height:60px; text-align:center; line-height:60px; background:#af60d0; opacity:.6; border-bottom:1px solid #d1b1f5; cursor:pointer;}
.fixBox .fixBoxN:hover{opacity:1;}
.fixBox .fixBoxN:first-child{ border-radius:5px 0 0 0;}
.fixBox .fixBoxN:last-child{ border-radius:0 0 0 5px;}
.fixBox .fixBoxN i{ font-size:32px; color:#FFF;}